<template>
	<view class="root">
		<view class="top-bar">
			<image src="../../../static/jwz.png" mode="" class="bg"></image>
		</view>
		<view class="introduce">
			<view class="title">
				<text>集文斋美术馆</text>
			</view>
			<view class="content">
				<text>潍坊集文斋文化艺术有限公司，坐落于“中 国画都”——潍坊。经过近二十年的不断发展， 逐步成长为国内领先的艺术品投资运营机构，公司下设美术馆、画廊、策展中心、评估鉴定等分支机构。公司以振兴发展中国文化艺术为己任， 以“树精品意识，创名牌画廊”为宗旨。</text>
			</view>
			<view class="phone">
				<text>联系方式：13689098909</text>
			</view>
		</view>
		
		
	<view class="tab-bar">
		<u-tabs :list="list" :is-scroll="false" :current="current" active-color="#c6100e" height="80" bg-color="#f8f8f8" @change="change"></u-tabs>
	</view>
		
		<view class="detail">
			<view class="list" @click="goToPerson">
				 <view>
				  <image src="../../../static/007.jpg" mode="" class="img"></image>
				 </view>
				 <view class="titles">
				 	<text>幽香</text>
				 </view>
				 <view class="contents">
				 	<text>沈光伟 68*68</text>
				 </view>
			</view>
			<view class="list" @click="goToPerson">
				 <view>
				 <image src="../../../static/007.jpg" mode="" class="img"></image>
				 </view>
				<view class="titles">
					<text>幽香</text>
				</view>
				<view class="contents">
					<text>沈光伟 68*68</text>
				</view>
			</view>
		</view>
		<view class="detail">
			<view class="list" @click="goToPerson">
				 <view>
				 <image src="../../../static/007.jpg" mode="" class="img"></image>
				 </view>
				<view class="titles">
					<text>幽香</text>
				</view>
				<view class="contents">
					<text>沈光伟 68*68</text>
				</view>
			</view>
			<view class="list" @click="goToPerson">
				 <view>
				 	 <image src="../../../static/007.jpg" mode="" class="img"></image>
				 </view>
				 <view class="titles">
				 	<text>幽香</text>
				 </view>
				 <view class="contents">
				 	<text>沈光伟 68*68</text>
				 </view>
			</view>
		</view>
	</view>
</template>

<script>
		export default {
			data() {
				return {
				list: [
					{
					name: '全部'
				  }, 
					{
					name: '书法',
				  },
					{
					name: '国画',
					}
				],
				current: 0
				}
			},
			methods:{
				goToPerson(){
					uni.navigateTo({
						url:'../person/person'
					})
				},
				change(index) {
				  this.current = index
				}
			}
		}
</script>

<style lang="scss" scoped>
	.top-bar .bg{
		width: 100%;
		height: 330rpx;
	}
	
	.title{
		font-size: 30rpx;
		font-weight: 700;
		margin-left: 40rpx;
	}
	
	.phone{
		font-size: 28rpx;
		color: #949494;
		margin-left: 40rpx;
		margin-top: 30rpx;
	}
	
	.content{
		width: 90%;
		margin-left: 5%;
		margin-top: 16rpx;
	  color: #949494;
		font-size: 28rpx;
		line-height: 42rpx;
		text-align: justify;
	}
	
	.detail{
		display: flex;
		margin-top: 30rpx;
		background-color: #fefffe;
	}
	
	.detail .list {
		height: 480rpx;
	}
	
  .img{
			width: 346rpx;
			height: 346rpx;
			margin-left: 20rpx;
			border-radius: 10rpx 10rpx 0 0;
		}
		
	.bottom{
			display: flex;
		  height: 1044rpx;
			margin-top: -400rpx;
		} 
		
	.titles{
		text-align: left;
		font-size: 32rpx;
		font-weight: 700;
		margin-left: 40rpx;
	}
	
	.contents{
		text-align: left;
		font-size: 28rpx;
		margin-left: 40rpx;
		color: #949494;
	}
	
	.column{
		width: 400rpx;
    margin-right: 40rpx;
	}
</style>

